<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>评论区</title>
    <link rel="stylesheet" href="css/css.css">
</head>

<body>
    <!-- 头部start -->
    <div class="comments">
        <div class="nav">
            <div class="user">
                <div class="userImage">
                    <img src="image/头像1.jpg" alt="" width="70px" style="cursor:pointer">
                </div>
                用户名称
            </div>
            <ul class="items">
                <li>首页</li>
                <li>社区</li>
                <li>个人中心</li>
                <li>功能板块</li>
            </ul>
        </div>
    </div>
    <!-- 头部end -->
    <!-- 评论区部分start -->
    <article>
        <div class="commentBlock">
            <div class="userImage">
                <img src="image/头像2.jpg" alt="" height="30px" width="30px">
            </div>
            <p class="suffix">评论：</p>
            <p class="comment">感觉不如原神</p>
            <p class="time">2020年12月21日</p>
            <p class="dele">删除</p>
        </div>
    </article>
    <!-- 评论区部分end -->
    <!-- 评论块start -->
    <main>
        <textarea name="sayHello" id="1" class="chat" cols="30" rows="1" placeholder="输入你想评论的内容"></textarea>
        <span class="launcher">发送</span>
    </main>
    <!-- 评论块end -->
    <!-- 用来切换头像 -->
    <span class="console">切换头像</span>
    <ul class="select">
        <li><img src="image/头像2.jpg" height="20px" width="20px">切换</li>
        <li><img src="image/头像2.jpg" height="20px" width="20px">切换</li>
        <li><img src="image/头像2.jpg" height="20px" width="20px">切换</li>
        <li><img src="image/头像2.jpg" height="20px" width="20px">切换</li>
        <li><img src="image/头像2.jpg" height="20px" width="20px">切换</li>
        <li><img src="image/头像2.jpg" height="20px" width="20px">切换</li>
    </ul>
    <script src="js/js.js"></script>

</body>

</html>